A basic example of the drawing API text object being used as a button to switch between charts

This goes in the documents header:

<script src="RGraph.common.core.js"></script>
<script src="RGraph.common.dynamic.js"></script>
<script src="RGraph.bar.js"></script>
<script src="RGraph.line.js"></script>
<script src="RGraph.drawing.text.js"></script>

Put this where you want the chart to show up:

<canvas id="cvs" width="600" height="250">
    [No canvas support]
</canvas>

This is the code that generates the chart:

<script>
    window.onload = function ()
    {
        var canvas = document.getElementById('cvs');
        
        /**
        * Draw the Line chart when the page loads
        */
        drawLine();


        /**
        * Draw the line chart
        */
        function drawLine ()
        {
            RGraph.Reset(canvas);

            var line = new RGraph.Line({
                id: 'cvs',
                data: [4,8,6,3,5,2,6],
                options: {
                    labels: ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturday','Sunday'],
                    hmargin: 5,
                    linewidth: 5,
                    textAccessible: true
                }
            }).draw()
            
            
            drawButtons();
        }




        
        
        /**
        * Draw the Bar chart
        */
        function drawBar ()
        {
            RGraph.reset(canvas);

            var bar = new RGraph.Bar({
                id: 'cvs',
                data: [4,8,6,3,5,2,6],
                options: {
                    labels: ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturday','Sunday'],
                    colors: ['Gradient(white:blue)'],
                    textAccessible: true
                }
            }).draw();
                
            drawButtons();
        }




        /**
        * Draw the buttons (using the drawing API text object).
        */
        function drawButtons ()
        {
            var text1 = new RGraph.Drawing.Text({
                id: 'cvs',
                x: 600 - 25 - 5,
                y: 25 + 5,
                text: 'Line chart',
                options: {
                    font: 'Arial',
                    size: 14,
                    bounding: true,
                    boundingFill: 'white',
                    boundingShadow: true,
                    boundingShadowColor: '#bbb',
                    boundingShadowOffsetx: 1,
                    boundingShadowOffsety: 1,
                    halign: 'right',
                    valign: 'top',
                    colors: ['blue'],
                    textAccessible: true,
                    textAccessiblePointerevents: false
                }
            }).on('click', function (e, shape)
            {
                drawLine();
            }).on('mousemove', function ()
            {
                return true;
            }).draw()




            var text2 = new RGraph.Drawing.Text({
                id: 'cvs',
                x: 600 - 25 - 5 - 5 - text1.coords[0][2],
                y: 25 + 5,
                text: 'Bar chart',
                options: {
                    font: 'Arial',
                    size: 14,
                    bounding: true,
                    boundingFill: 'white',
                    boundingShadow: true,
                    boundingShadowColor: '#bbb',
                    boundingShadowOffsetx: 1,
                    boundingShadowOffsety: 1,
                    halign: 'right',
                    valign: 'top',
                    colors: ['blue'],
                    textAccessible: true,
                    textAccessiblePointerevents: false
                }
            }).on('click', function (e, shape)
            {
                drawBar();
            }).on('mousemove', function ()
            {
                return true;
            }).draw().




            
            text1.onmousemove =
            text2.onmousemove = function (e, shape)
            {
                e.target.style.cursor = 'pointer';
            }
        }
    };
</script>